import {NavLink, useNavigate} from "react-router-dom";

export const App = () => {
    //获取路由跳转方法
    const navigate = useNavigate();
    return (
        <div>
            <h1>我是App</h1>
            <div>
                <NavLink to={"login"}>登录页</NavLink>&nbsp;&nbsp;
                <NavLink to={"article"}>文章页</NavLink>
            </div>
            <br/>
            <div>
                <button onClick={() => {
                    navigate("/login?name=zhl&age=18")
                }}>登录页 search传参
                </button>
                &nbsp;&nbsp;
                <button onClick={() => {
                    navigate("/article/react/good good study,day day up")
                }}>文章页 props传参
                </button>
                &nbsp;&nbsp;
                <button onClick={() => {
                    navigate("/home", {state:{name: "zhl", age: 18, sex: "男"}})
                }}>首页 state传参
                </button>
            </div>
        </div>
    )
}
